<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery提示通知插件JBox</title>

<meta name="viewport" content="width=1000">

<link rel="stylesheet" href="css/1.css">

<script type="text/javascript" src="js/jquery-2.0.3.js"></script>

</head>
<body>

<div class="g-line demo-title-line">
	<div class="demo-title" style="width: 120px; margin-left: -60px">提示文本</div>
</div>

<div class="demo-buttons clearfix">
	<div class="demo-button" id="demoT1">Hover me!</div>
	<div class="demo-button" id="demoT2">Hover me!</div>
	<div class="demo-button" id="demoT3">Hover me!</div>
	<div class="demo-button" id="demoT4">Hover me!</div>
	<div class="demo-button" id="demoT5">Hover me!</div>
	<div class="demo-button" id="demoT6">Hover me!</div>
	<div class="demo-button demo-button-click" id="demoT7">Click me!</div>
	<div class="demo-button demo-button-click" id="demoT8">Click me!</div>
</div>
<div class="g-line demo-title-line">
	<div class="demo-title" style="width: 180px; margin-left: -90px">模态窗口</div>
</div>

<div class="demo-buttons clearfix">
	<div class="demo-button demo-button-click" id="demoM1">Click me!</div>
	<div class="demo-button demo-button-click" id="demoM2">Click me!</div>
	<div class="demo-button demo-button-click" id="demoM3">Click me!</div>
	<div class="demo-button demo-button-click" id="demoM4">Click me!</div>
</div>

<div class="g-line demo-title-line">
	<div class="demo-title" style="width: 100px; margin-left: -50px">注意</div>
</div>

<div class="demo-buttons clearfix">
	<div class="demo-button demo-button-notice demo-button-click" id="demoN1"><span class="jBox-notice-text">Click me!</span></div>
	<div class="demo-button demo-button-notice demo-button-click" id="demoN2"><span class="jBox-notice-text">Click me!</span></div>
	<div class="demo-button demo-button-notice demo-button-click" id="demoN3"><span class="jBox-notice-text">Click me!</span>
		<div class="jBoxN3-volume-container">
			<div class="jBoxN3-volume icon-volume-mute" id="jBoxN3-volume0" onClick="setN3Volume(0)"></div>
			<div class="jBoxN3-volume icon-volume-low" id="jBoxN3-volume50" onClick="setN3Volume(50)"></div>
			<div class="jBoxN3-volume icon-volume-medium active" id="jBoxN3-volume100" onClick="setN3Volume(100)"></div>
		</div>
	</div>
	<div class="demo-button demo-button-notice demo-button-click" id="demoN4"><span class="jBox-notice-text">Click me!</span></div>
</div>

<script type="text/javascript" src="js/jBox.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>

</body>
</html>
